<template>
    <el-drawer title="操作记录" :visible.sync="drawer" direction="rtl" size='550px'>
        <el-table :data="tableList" border style="width: 100%;"
            :header-cell-style="{background:'#fafafa',color:'#000',fontWeight:400,fontSize:'12px'}"
            :cell-style="{color:'#5a5a5a',fontSize:'12px',fontWeight:400}" max-height='560' v-loading="loading"
            element-loading-text="加载中" element-loading-background="rgba(250, 250, 250, 0.5)"
            element-loading-spinner="el-icon-loading">
            <el-table-column prop="handleTime" label="操作时间" width='160'>
            </el-table-column>
            <el-table-column prop="handleName" label="操作用户" width='80'>
            </el-table-column>
            <el-table-column prop="handleType" label="操作类型" width='100'>
            </el-table-column>
            <el-table-column label="操作详情">
                <template slot-scope="scope">
                    <div style='max-height:80px;overflow:auto' class="scroll">
                        {{scope.row.handleDetail}}
                    </div>
                </template>
            </el-table-column>
            <div slot="empty">
                <el-empty :image-size='100'></el-empty>
            </div>
        </el-table>
        <el-pagination v-if="total" @current-change="handleCurrentChange" :page-size='params.limit'
            layout="prev, pager, next" :total="total" background>
        </el-pagination>
    </el-drawer>
</template>

<script>
    import {
        handleLogList
    } from '@/api/produceController'
    export default {
        data() {
            return {
                tableList: [],
                drawer: false,
                total: 0,
                loading: false,
                params: {
                    page: 1,
                    limit: 10,
                    type: 2
                }
            }
        },
        methods: {
            handle() {
                this.drawer = true
                this.getHandleLogList(this.params)
            },
            //操作记录
            getHandleLogList(data) {
                this.loading = true
                handleLogList(data).then(res => {
                    if (res.code == 200) {
                        this.tableList = res.data.records
                        this.total = res.data.total
                    }
                    this.loading = false
                })
            },
            //pageSize 改变时会触发
            handleSizeChange(val) {
                this.params.limit = val
                this.getHandleLogList(this.params)
            },
            //currentPage 改变时会触发
            handleCurrentChange(val) {
                this.params.page = val
                this.getHandleLogList(this.params)
            },
        }
    }
</script>

<style lang="less" scoped>
    .operationHistory {
        padding: 20px 20px 0;
    }
</style>